<%@ page import="com.hellojavaweb.bean.User" %><%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2017/1/11
  Time: 11:10
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="com.hellojavaweb.bean.Money" %>
<html>
<head>
    <title>首页</title>
    <style type="text/css">
        .nav ul{
            width:980px;/*设置元素宽度为980px*/
            border:1px solid #000;/*设置一个颜色为#000，宽度为1px的边框*/
            margin:0px auto 0px auto;/*也可以简写为margin:0 auto*/
        }
        .nav li{
            float:left;/*让li元素左浮动*/
        }
        .nav ul li a{
            width:80px;/*设置元素宽为80px*/
            height:28px;/*设置高度为28px*/
            line-height:28px;/*设置行距为28px，让文字在每行的中间位置*/
            background:#dedede;/*设置元素的背景为红色*/
            color:#000;/*文字颜色是白色*/
            margin:5px 80px;
            font-size:12px;/*用12号字*/
            display:block;/*这个比较关键，因为a本身就是联级元素，本身不具有宽高，用这个把它变成块级元素，这样前面设置的宽和高就能起作用了*/
            text-align:center;/*让文本居中*/
            text-decoration:none; /*去掉下划线*/
        }
        .nav ul li a:hover{ /*这个大概的意思就是当鼠标放到这个a元素的上面时，这个a元素的样式就按下面的代码执行*/
            width:78px;
            height:26px;
            line-height:28px;
            border:1px solid #dedede;
            color:#000;
            background:#FFF;
        }

    </style>
</head>
<body>
<h1>${sessionScope.username}</h1>
<div class="nav">
    <ul>
        <li><a href="userTable_dtt.jsp">用户表</a></li>
        <li><a href="moneyTable_dtt.jsp">余额表</a></li>
        <li><a href="out_dtt.jsp">支出</a></li>
        <li><a href="in_dtt.jsp">收入</a></li>
    </ul>
</div>

</body>
</html>
